<template>
  <!--需预约的成功支付页-->
  <div>
    <ul>
      <li><img src="../../assets/successimg.png" alt="" width="40"></li>
      <li>预约中</li>
      <li>预约结果将会短信通知您，请注意查收</li>
      <li>
        <wv-button type="default" :mini="true" @click="goIndex">回到首页</wv-button>
        <wv-button type="default" :mini="true" @click="lookDetail">查看详情</wv-button>
      </li>
    </ul>
  </div>
</template>

<script type="text/ecmascript-6">
  export default {
    name: 'yuyuesuccess',
    props: {},
    data() {
      return {
        appointmentId: ''
      };
    },
    methods: {
      goIndex() {
        this.$router.push({path: '/index'})
      },
      lookDetail() {
        this.$router.push({path: '/yuyuedetail', query: {appointmentId: this.appointmentId}})
      }
    },
    created() {
      let appointmentId = this.$route.query.appointmentId;
      this.appointmentId = appointmentId;
    },
    components: {}
  }
</script>


<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped lang="less" rel="stylesheet/less">
  ul {
    padding-top: 50px;

    li:nth-child(2) {
      font-size: 18px;
      color: #111;
      margin: 10px 0;
    }

    li:nth-child(3) {
      color: #999;
      font-size: 13px;
    }

    li:last-child {
      display: flex;
      padding: 10px;
      margin-top: 20px;

      .weui-btn + .weui-btn {
        margin-top: 0;
      }

      button {
        flex: 1;
        font-size: 15px;
        border-radius: 25px;
        height: 40px;
        line-height: 40px;
      }

      :first-child {
        color: #2e94f0;
        background-color: #fff;
        margin-right: 10px;
        border: 1px solid #2e94f0;
      }

      :last-child {
        background-color: #2e94f0;
        color: #fff;
      }
    }

  }
</style>
